<!DOCTYPE html>
<html>
<head>
   <meta charset="UTF-8">
    <title>微课堂 V1.0</title>
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width,user-scalable=yes, minimum-scale=0.4, initial-scale=0.8,target-densitydpi=low-dpi" />
    <link rel="shortcut icon" href="/favicon.ico" type="image/x-icon" />
    <link rel="stylesheet" href="./css/font.css">
    <link rel="stylesheet" href="./css/xadmin.css">
    <script type="text/javascript" src="https://cdn.bootcss.com/jquery/3.2.1/jquery.min.js"></script>
    <script type="text/javascript" src="./lib/layui/layui.js" charset="utf-8"></script>
    <script type="text/javascript" src="./js/xadmin.js"></script>
    <!-- 让IE8/9支持媒体查询，从而兼容栅格 -->
    <!--[if lt IE 9]>
      <script src="https://cdn.staticfile.org/html5shiv/r29/html5.min.js"></script>
      <script src="https://cdn.staticfile.org/respond.js/1.4.2/respond.min.js"></script>
    <![endif]-->
</head>
<body class="layui-anim layui-anim-up">
    <div class="x-nav">
      <span class="layui-breadcrumb">
        <a href="welcome.html">首页</a>
        <a href="course-list.html">分类管理</a>
        <a>
          <cite>分类列表</cite></a>
      </span>
      <a class="layui-btn layui-btn-small" style="line-height:1.6em;margin-top:3px;float:right" href="javascript:location.replace(location.href);" title="刷新">
        <i class="layui-icon" style="line-height:30px">ဂ</i></a>
    </div>
    <div class="x-body">
     <div class="layui-form layui-col-md12 x-so">
          <input type="text" name="content" id="content"  placeholder="类型编号或者名称" autocomplete="off" class="layui-input">
          <button class="layui-btn" lay-filter="content" id="searchList"><i class="layui-icon">&#xe615;</i></button>
       </div>
    
	<!-- <div class="layui-btn-group typeTableTable">
	  <button class="layui-btn" data-type="getCheckData">获取选中行数据</button>
	  <button class="layui-btn" data-type="getCheckLength">获取选中数目</button>
	  <button class="layui-btn" data-type="isAll">验证是否全选</button>
	</div> -->
 
	<table class="layui-table" lay-data="{width: 900, height:500, url:'/wechat/type/list_', page:true, id:'listTable'}" lay-filter="typeTable">
	  <thead>
	    <tr>
	     <!--  <th lay-data="{type:'checkbox', fixed: 'left'}"></th> -->
	      <th lay-data="{field:'typeId', width:300, sort: true, fixed: true, align:'center',}">类型编号</th>
	      <th lay-data="{field:'typeName', width:460, sort: true, align:'center',edit:'text'}">类型名称</th>
	      <th lay-data="{fixed: 'right', width:140, align:'center', toolbar: '#bartypeTable'}">操作</th>
	    </tr>
	  </thead>
	</table>
    </div>
	<script type="text/html" id="bartypeTable">
 		 <a class="layui-btn layui-btn-xs" lay-event="save">保存</a>
 		 <a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="del">删除</a>
	</script>
	               
	<script>
	layui.use('table', function(){
	  var table = layui.table;
	//监听单元格编辑
	  table.on('edit(typeTable)', function(obj){
	    var value = obj.value //得到修改后的值
	    data = obj.data, //得到所在行所有键值
	    field = obj.field; //得到字段
	    layer.msg('[ID: '+ data.typeId +'] ' + field + ' 字段更改为：'+ value);
	    $.ajax({
	  		url : '/wechat/type/edit',
	  		method : 'get',
	  		data : {
	  			typeId : data.typeId,
	  			typeName : value
	  		},
	  		success: function(data){
	  			layer.msg('修改成功');
	  		},
	  		fail : function(){
	  			layer.tip('修改失败');
	  		}
	  	});
	  });
	  
	  //监听工具条
	  table.on('tool(typeTable)', function(obj){
	    var data = obj.data;
	    if(obj.event === 'save'){
	    	  	$.ajax({
	    	  		url : '/wechat/type/edit',
	    	  		method : 'get',
	    	  		data : {
	    	  			typeId : data.typeId,
	    	  			typeName : data.typeName
	    	  		},
	    	  		success: function(data){
			        layer.msg('保存成功');
	    	  		},
	    	  		fail : function(){
	    	  			layer.msg('保存失败');
	    	  		}
	    	  	});
	    }else if(obj.event === 'del'){
	    	  	$.ajax({
	    	  		url : '/wechat/type/delete',
	    	  		method : 'get',
	    	  		data : {
	    	  			id : data.typeId
	    	  		},
	    	  		success: function(data){
			        layer.msg('删除成功');
			        obj.del();
			        layer.close(index);
	    	  		},
	    	  		fail : function(){
	    	  			layer.msg('删除失败');
	    	  		}
	    	  	});
	    }
	  });
	  
	  $("#searchList").on('click', function(){
		  table.reload('listTable', {
			  url: '/wechat/type/list_',
			  where: {
				  content : $("#content").val()
			  } //设定异步数据接口的额外参数
		  });
	  });
	  
	});
	</script>
    <script>var _hmt = _hmt || []; (function() {
        var hm = document.createElement("script");
        hm.src = "https://hm.baidu.com/hm.js?b393d153aeb26b46e9431fabaf0f6190";
        var s = document.getElementsByTagName("script")[0];
        s.parentNode.insertBefore(hm, s);
      })();</script>
  </body>
  
</html>